<!--
 * @Author: Dorange.Wang
 * @Date: 2021-07-07 17:45:09
 * @LastEditors: your name
 * @LastEditTime: 2021-07-19 15:51:03
 * @Description: file content
-->
<template>
  <WidgetTree
    :widgets="widgetTree"
    :values="pageData"
    :value-callback="pageDataSet"
  />
</template>

<script>
// import PageData from '@/observer/pageData'
import { getHmpageInfoKey, getHmpageInfo } from "@/apis/app/HmPageController";
import { postHmhttprequestdefinitionExecute } from "@/apis/app/HmHttpRequestDefinitionController";
import "@/widgets";
export default {
  name: "Universal",

  data() {
    return {
      pageData: {},
      pageConfig: {},
      widgetTree: [],
    };
  },

  watch: {
    $route: {
      handler: "handleRouteChange",
      immediate: true,
    },
  },

  methods: {
    pageDataSet(key, value) {
      console.log("this.pageData", key, value, this.pageData);
      this.$set(this.pageData, key, value);
    },

    getPageConfig() {
      const { pageId } = this.$route.params;
      if (/^\d+$/.test(String(pageId))) {
        return getHmpageInfo({
          id: pageId,
          includeJson: true,
        });
      } else {
        return getHmpageInfoKey({
          key: pageId,
          includeJson: true,
        });
      }
    },

    async initPageData() {
      const { id } = this.$route.query;
      const { pageId } = this.$route.params;
      if (id) {
        const data = await postHmhttprequestdefinitionExecute({
          key: "selectOne",
          pageId,
          values: { id },
        });
        // Object.assign(PageData,data)
        this.pageData = data;
      }
    },

    async handleRouteChange() {
      this.initPageData();
      const data = await this.getPageConfig();
      const { json } = data;
      const { FormData: pageConfig, formList: widgetTree } = JSON.parse(json);
      console.log("pageConfig", pageConfig);
      console.log("widgetTree", widgetTree);
      this.widgetTree = widgetTree;
    },
  },
};
</script>

<style></style>
